<!DOCTYPE html>
<%@ page language="java" import="java.util.*" contentType="text/html;charset=UTF-8"%>
<%@include file="../../common/include/inc.jsp" %>
<head lang="en">
    <title>首页</title>
    <link rel="stylesheet" href="${ctx}/resource/plugins/ued/pub-ui/css/default.css"/>
    <link rel="stylesheet" href="${ctx}/resource/plugins/ace/assets/css/ace.css" class="ace-main-stylesheet" id="main-ace-style"/>
    <link rel="stylesheet" href="${ctx}/resource/plugins/ued/css/bootstrap.css"/>
    <link rel="stylesheet" href="${ctx}/resource/plugins/ued/css/page-styles.css"/>
</head>
<style>
    .table th, .table td {
        text-align: center;
        vertical-align: middle!important;
    }
    .table-bordered th,
    .table-bordered td {
        border: 1px solid #2e75b6 !important;
    }
</style>
<body style="overflow: hidden;min-width: 1703px">
<!--主要内容 begin-->
<div class="content c-width pd-5 pdt-0 " >
    <ul class="clearfix section-1">
        <li class="item-3" style="width: 99.8%;">
            <%--资源总览--%>
            <div class="bd-grey item-2-map mgt-5" style="height: 430px;" >
                <div style="width: 20%;float: left">
                <table class="table table-bordered" style="width: 98%;margin: 50px 10px;float: left">
                    <thead>
                    <tr>
                        <th bgcolor="#282c2d"><font color="#A8CFDB">业务分类</font></th>
                        <th bgcolor="#282c2d"><font color="#A8CFDB">健康度(分)</font></th>
                        <th bgcolor="#282c2d"><font color="#A8CFDB">健康状态</font></th>
                    </tr>
                    </thead>
                    <tbody id="tb4">

                    </tbody>
                </table>
                </div >
                <div style="width: 20%;float: left">
                    <table class="table table-bordered" style="width: 98%;margin: 50px 10px;">
                        <thead>
                        <tr>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">平台分类</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">健康度(分)</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">健康状态</font></th>
                        </tr>
                        </thead>
                        <tbody id="tb5">

                        </tbody>
                    </table>
                </div>
                <div style="width:20%;float: left">
                    <div style="margin-top: 20px">
                        <span style='font-size: 20px;margin-right: 5%;color: #29F7FF' id="jk"></span> <span style='font-size: 20px;color:#13F825' id="zt"></span>
                    </div>
                    <div style="width: 100%;height:450px;float: left" id="left_top_echart1"></div>
                </div>
                <div style="width: 20%;float: left">
                    <table class="table table-bordered" style="width: 98%;margin: 50px 10px;float: left">
                        <thead>
                        <tr>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">平台分类</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">健康度(分)</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">健康状态</font></th>
                        </tr>
                        </thead>
                        <tbody id="tb6">

                        </tbody>
                    </table>
                </div >
                <div style="width: 20%;float: left">
                    <table class="table table-bordered" style="width: 98%;margin: 50px 10px;">
                        <thead>
                        <tr>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">平台分类</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">健康度(分)</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">健康状态</font></th>
                        </tr>
                        </thead>
                        <tbody id="tb7">

                        </tbody>
                    </table>
                </div>
            </div>
        </li>
        </ul>
    <ul class="clearfix section-1">

        <li class="item-1" style="width: 25%;height: auto">
            <div class="bd-grey item-2-map mgt-5" style="height: 600px;" >
                <div style="margin-top: 20px" >
                    <span style='font-size: 20px;margin-right: 60%;color: #29F7FF'>资源指标</span> <span style='font-size: 20px;color:#13F825'>更多</span>
                    <div style=" margin-top: 1%;margin-left: 3%;width: 22%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>总数量</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="zs"></span>

                    </div>
                    <div style=" margin-top: 1%;margin-left: 3%;width: 22%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>在运</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="zy"></span>

                    </div>
                    <div style=" margin-top: 1%;margin-left: 3%;width: 22%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>剩余</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="sy"></span>
                    </div>
                    <div style=" margin-top: 1%;margin-left: 3%;width: 22%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>使用率</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="syl"></span>

                    </div>
                </div>
                <div style="height:auto;">
                <table class="table table-bordered" style="">
                    <thead>
                    <tr>
                        <th bgcolor="#282c2d"><font color="#A8CFDB">资源分类</font></th>
                        <th bgcolor="#282c2d"><font color="#A8CFDB">总数量</font></th>
                        <th bgcolor="#282c2d"><font color="#A8CFDB">在运</font></th>
                        <th bgcolor="#282c2d"><font color="#A8CFDB">剩余</font></th>
                        <th bgcolor="#282c2d"><font color="#A8CFDB">使用率</font></th>
                    </tr>
                    </thead>
                    <tbody id="tb8">

                    </tbody>
                </table>
            </div>
            </div>
        </li>

        <li class="item-2 mgl-10 mgr-10" style="width: 24%;">
            <%--资源消费概览--%>
            <div class="bd-grey item-2-map mgt-5" style="height: 600px;">
                <div id="center_echart" style="height: 98%;width: 98%">

                </div>
            </div>
            <%--资源消费概览--%>
        </li>
        <li class="item-3" style="width: 24%;">
            <%--资源消费概览--%>
            <div class="bd-grey item-2-map mgt-5" style="height: 600px;">
                <div style="margin-top: 20px" >
                    <span style='font-size: 20px;margin-right: 60%;color: #29F7FF'>巡检指标</span> <span style='font-size: 20px;color:#13F825'>更多</span>
                    <div style=" margin-top: 1%;margin-left: 3%;width: 30%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>巡检总任务</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="xjrw"></span>

                    </div>
                    <div style=" margin-top: 1%;margin-left: 3%;width: 30%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>任务成功</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="rwcg"></span>

                    </div>
                    <div style=" margin-top: 1%;margin-left: 3%;width: 30%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>任务失败</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="rwsb"></span>
                    </div>
                </div>

                <div style="height:auto;">
                    <table class="table table-bordered" style="">
                        <thead>
                        <tr>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">任务组</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">总任务</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">成功</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">失败</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">健康度</font></th>
                        </tr>
                        </thead>
                        <tbody id="tb10">

                        </tbody>
                    </table>
                </div>
            </div>
            <%--资源消费概览--%>
        </li>

        <li class="item-3" style="width: 25%;margin-left: 10px">
            <%--资源总览--%>
            <div class="bd-grey item-2-map mgt-5" style="height: 600px;" >
                <div id="center_right_echart" style="height: 98%;width: 98%">

                </div>
            </div>
        </li>
    </ul>
    <ul class="clearfix section-1" style="margin-top: 33px;" >
        <li class="item-1" style="width: 54%;">

            <div class="bd-grey item-2-map mgt-5" style="height: 500px;">
                <div style="margin-top: 20px" >
                    <span style='font-size: 20px;margin-right: 78%;color: #29F7FF'>监控指标</span> <span style='font-size: 20px;color:#13F825'>更多</span>
                    <div style=" margin-top: 1%;margin-left: 5%;width: 11%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>监控指标</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="jkzb"></span>

                    </div>
                    <div style=" margin-top: 1%;margin-left: 5%;width: 11%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>严重告警</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="yzgj"></span>

                    </div>
                    <div style=" margin-top: 1%;margin-left: 5%;width: 11%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>重要告警</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="zygj"></span>
                    </div>
                    <div style=" margin-top: 1%;margin-left: 5%;width: 11%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>一般告警</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="ybgj"></span>

                    </div>
                    <div style=" margin-top: 1%;margin-left: 5%;width: 13%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>已消除告警</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="yxcgj"></span>

                    </div>
                    <div style=" margin-top: 1%;margin-left: 5%;width: 11%;float: left">
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF'>活动告警</span>
                        <span style='font-size: 20px;margin-right: 12%;color: #29F7FF' id="hdgj"></span>

                    </div>
                </div>
                <div>
                    <table class="table table-bordered" style="width: 47.5%;margin: 20px 10px;float: left">
                        <thead>
                        <tr>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">资源分类</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">严重告警</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">重要告警</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">一般告警</font></th>

                        </tr>
                        </thead>
                        <tbody id="on">

                        </tbody>
                    </table>

                    <table class="table table-bordered" style="width: 48%;margin: 20px 10px;float: right">
                        <thead>
                        <tr>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">资源分类</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">严重告警</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">重要告警</font></th>
                            <th bgcolor="#282c2d"><font color="#A8CFDB">一般告警</font></th>
                        </tr>
                        </thead>
                        <tbody id="off">

                        </tbody>
                    </table>

                </div>
            </div>
        </li>
        <li   style="width: 45%;margin-left: 10px">
            <div class="bd-grey item-2-map mgt-5" style="height: 500px;width: 100%;" >

                <div id="down_right_echart" style="height: 98%;width: 98%"></div>
            </div>
        </li>
    </ul>
</div>
<script type="text/javascript" src="${ctx}/resource/plugins/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="${ctx}/resource/plugins/echarts4/esl.js"></script>
<script type="text/javascript" src="${ctx}/resource/plugins/ued/js/circle-progress.js"></script>
<script type="text/javascript" src="${ctx}/resource/plugins/ued/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${ctx}/resource/resource/overview/overView.js"></script>

</body>
</html>
